<template>
	<view style="width: 100%">
		<view @click="onClick" v-if="disable">
			<slot name="button">
				<button plain hairline type="primary" block>上传文件</button>
			</slot>
		</view>

		<!-- 上传方式   -->
		<u-popup ref="choose-file" :is-mask-click="true" ><!-- type="bottom" -->
			<view class="choose-list">
				<view @click="onTypeClick('1')">上传文件</view>
				<view @click="onTypeClick('2')">拍照</view>
				<view @click="onTypeClick('3')">拍摄视频</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import getLocal from "../../common/localTools"; // gps 定位
	import {upload} from "../../common/js/request";  // upload 文件上传

	export default {
		name: "file-choose",
		props: {
			project: {
				type: Object,
				required: true,
			},
			local: {
				type: String,
				default: "",
			},
			needLocal: {
				type: Boolean,
				default: true,
			},
			index: {},
			disable: {
				type: Boolean,
				default: true,
			},
		},
		data() {
			return {
				localName: "",
			};
		},
		computed: {

		},
		watch: {

		},
		created() {
			this.init();
		},
		mounted() {

		},
		methods: {
			
			async init() {
				/* if (this.needLocal) {
					const { code, data } = await getLocal();
						debugger
					if (code !== "0") {
						uni.showModal({
							title: "敬告",
							content: "由于您未授权位置信息，无法上传文件..",
						});
						return "";
					}
					this.localName = data[0].name;
				} else {
					this.localName = this.local;
				} */
				
				
				this.paramsData = {
					dataId: this.project.id,
					addressLocal: this.localName,
					isRecord: "Y",
					...this.project,
				};
			},
			
			// 显示上传方式：拍照、拍摄视频、上传文件
			onClick() {
				this.$refs["choose-file"].open();
			},
			onTypeClick(type) {
				try {

					if (type === "1") {
						this.$emit("upload", this.index);
						
					} else if (type === "2") {
						uni.chooseImage({
							count: 3, //默认9
							sizeType: ["original", "compressed"], //指定原图、压缩图，默认二者都有
							success: (res) => {
								this.uploadHandler(res.tempFilePaths);
							},
						});
						
					} else if (type === "3") {
						uni.chooseVideo({
							sourceType: ["camera", "album"],
							maxDuration: 30,
							success: (res) => {
								this.uploadHandler([res.tempFilePath]);
							},
						});
					}

				} catch (e) {
					uni.showModal({
						title: "提示",
						content: "服务器异常",
						showCancel: false,
					});
				}
				this.$refs["choose-file"].close();
			},

			uploadHandler(filePaths) {
				filePaths.forEach(async (filePath) => {
					await upload(
						filePath,
						this.paramsData
					)
					.then(data => {		
						// 回传调用方
						this.$emit("uploadHandler", data, this.index);
						
					});
					
					
				});
			},
		},
	};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
	.choose-list {
		height: 20vh;
		background-color: white;

		view {
			width: 100%;
			height: 50px;
			line-height: 50px;
			text-align: center;
			font-size: 1.25rem;
			border-bottom: 1px #eeeeee solid;
		}
	}
</style>
